<!DOCTYPE html>
<html xmlns:th=”http://www.thymeleaf.org”>
<head>
<title>用户管理</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/css/bootstrap-all.css">
<script src="/js/bootstrap-all.js"></script>
<!-- 系统CSS或JS -->
<link rel="stylesheet" href="/css/system.css">

<style>
</style>
<body>
	<div id="container">
		<div class='row'>
			<div class='col-3'>
				<h4>用户管理</h4>
			</div>
		</div>
		<div class='bh2'></div>
		<div class='bg-content'>

			<form action="/getUser?cur=1">
				<div class="row">
					<div class="col-sm-2">
						用户名：<input type="text" name='usercode' id='usercode' 
							style='width: 150px; height: 25px;'  th:value='${param.usercode}' />
					</div>

					<div class="col-sm-2">
						用户角色：<select name='username' id='username' style='width: 150px; height: 25px;'>
							<option value="">请选择</option>
							<option value="0"
								th:attr="selected=${username=='0' ? '1' : null}">普通用户</option>
							<option value="1"
								th:attr="selected=${username=='1' ? '1' : null}">系统用户</option>
						</select>
					</div>

					<div class="col-sm-2">
						分公司： <select name='comcode' id='comcode' style='width: 150px; height: 25px;'
							th:value='${comcode}'>
							<option value="">请选择</option>
							<span th:each="com:${comlist}">
								<option th:each="entry:${com}"
									th:attr="selected=${comcode==#strings.substring(entry.value,0,#strings.indexOf(entry.value,'--')) ? '1' : null}"
									th:value="${#strings.substring(entry.value,0,#strings.indexOf(entry.value,'--'))}"
									th:text="${entry.value}"></option>
						</span>
						</select>
					</div>
				</div>

				<div class='row' style='padding: 15px;'>
					<button class="bg-primary mybtn" id='queryUser'>查询用户</button>
					<button class="mybtn bg-primary" style='margin-left: 45px;' type="button"
						id='addUser'>添加用户</button>
				</div>
			</form>
		</div>
		<div class='bh5'></div>

		<div class='bg-content'>
			<div>用户表结果：</div>
			<div class='bh2'></div>
			<div>
				<table
					class="table table-striped table-bordered table-hover  table-sm">
					<thead>
						<tr>
							<th>用户名</th>
							<th>用户角色</th>
							<th>分公司</th>
							<th>菜单组</th>
							<th>创建日期</th>
							<th>菜单权限操作</th>
						</tr>
					</thead>
					<tbody>
						<tr th:each="user,index:${users}">
							<td th:each="entry :${user}" th:text='${entry.value}'  ></td>
							<td style='width: 300px;'><button
									class="bg-danger table-btn" data-toggle="modal" data-target="#myModal"  id='removeMenu'  th:attr='title=${index.index}' >移出本组</button></td>
						</tr>
					</tbody>
				</table>
				<div class='row'>
				<ul class="pagination pagination-sm offset-sm-4"  >
					<li class="page-item" th:if='${cur!=1&&cur!=0}'><a class="page-link" th:href="'/getUser?cur=1&usercode=' +${usercode}+'&username=' +${username}+'&comcode=' +${comcode}">首 页</a></li>
					<li class="page-item" th:if='${cur!=1&&cur!=0}'><a class="page-link" th:href="'/getUser?cur='+${cur-1}+'&usercode=' +${usercode}+'&username=' +${username}+'&comcode=' +${comcode}">上一页</a></li>
					<li class="page-item" th:if='${cur!=0&&pageCount>1}' th:each="i:${pageCount>5 ? #numbers.sequence(cur>3?cur<(pageCount-2)?cur-2:(pageCount-4):1,cur>3? cur<(pageCount-2)?cur+2:(pageCount):5) : #numbers.sequence(1,pageCount)}"><a class="page-link" th:href="'/getUser?cur='+${i}+'&usercode=' +${usercode}+'&username=' +${username}+'&comcode=' +${comcode}" th:text='${i}'></a></li>
					<li class="page-item" th:if='${cur!=(pageCount)}'><a class="page-link" th:href="'/getUser?cur='+${cur+1}+'&usercode=' +${usercode}+'&username=' +${username}+'&comcode=' +${comcode}">下一页</a></li>
					<li class="page-item" th:if='${cur!=(pageCount)}'><a class="page-link" th:href="'/getUser?cur='+${pageCount}+'&usercode=' +${usercode}+'&username=' +${username}+'&comcode=' +${comcode}">尾 页</a></li>
				</ul>
				</div>
				<button data-toggle="modal" data-target="#myModal" class="bg-danger table-btn a-btn text-white" th:attr="href='/getUser?op=deleteUser&usercode=' +${usercode}+'&username=' +${username}+'&comcode=' +${comcode} , title=${usercode}"  id='deleteUser'>删除用户</button>
				<button class="bg-danger a-btn myleft-2 text-white"   data-toggle="modal" data-target="#myModal1" >修改用户</button>
				<button class="bg-success table-btn myleft-2 a-btn text-white">添加权限</button>
			</div>

		</div>

  <div class='row  mytips mytips-none'   >
		 <div class="alert alert-danger alert-dismissible fade show">
	    		<button type="button" class="close" data-dismiss="alert">&times;</button>
	    	<strong>错误!</strong>
  		</div>
</div>


   
  <!-- 模态框 -->
  <div class="modal fade myalert" id="myModal">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <!-- 模态框头部 -->
        <div class="modal-header">
          <span class="modal-title">系统提示：</span>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>
        <!-- 模态框主体 -->
        <div class="modal-body">
          			 
        </div>
        <!-- 模态框底部 -->
        <div class="modal-footer">
          <button   class="btn btn-success btn-sm" data-dismiss="modal" id='modal-1'>确 认</button> 
          <button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal"  id='modal-0'>取 消</button>
        </div>
   
      </div>
    </div>
  </div>
  
  <!-- 模态框 -->
  <div class="modal fade myalert" id="myModal1">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <!-- 模态框头部 -->
        <div class="modal-header">
          <span class="modal-title">系统提示：</span>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>
        <!-- 模态框主体 -->
        <div class="modal-body modal-body1">
          			 <div class='bg-content'>

			<form action="">
				<div class="row">
					<div class="col-sm-4">
						用户名：<input type="text" name='usercode'
							style='width: 150px; height: 25px;'  th:value='${param.usercode}' />
					</div>

					<div class="col-sm-4">
						用户角色：<select name='username' style='width: 150px; height: 25px;'>
							<option value="">请选择</option>
							<option value="0"
								th:attr="selected=${username=='0' ? '1' : null}">普通用户</option>
							<option value="1"
								th:attr="selected=${username=='1' ? '1' : null}">系统用户</option>
						</select>
					</div>

					<div class="col-sm-4">
						分公司： <select name='comcode' style='width: 150px; height: 25px;'
							th:value='${comcode}'>
							<option value="">请选择</option>
							<span th:each="com:${comlist}">
								<option th:each="entry:${com}"
									th:attr="selected=${comcode==#strings.substring(entry.value,0,#strings.indexOf(entry.value,'--')) ? '1' : null}"
									th:value="${#strings.substring(entry.value,0,#strings.indexOf(entry.value,'--'))}"
									th:text="${entry.value}"></option>
						</span>
						</select>
					</div>
				</div>

				<div class='row' style='padding: 15px;'>
					<button class="bg-primary mybtn "  id="updateUser">确认</button>
					<button class="mybtn bg-primary float-right" style='margin-left: 45px;'>取消</button>
				</div>
			</form>
		</div>
        </div>
        <!-- 模态框底部 -->
   
   
      </div>
    </div>
  </div>
  
  <div th:attr="title=${users}" class='userSize'></div>
  <div th:attr="title=${usercode}" class='usercode1'></div>
  <div th:attr="title=${username}" class='username1'></div>
   <div th:attr="title=${comcode}" class='comcode1'></div>
</div>
</body>
<script type="text/javascript">
 $(function(){
	/* $('#deleteUser').click2(function(){
		$('.myalert strong').html("确认删除吗？");
		$('.myalert').removeClass('myalert-none');
		location.href=$('#deleteUser').attr('href');
	}); */
	
	$('#updateUser').click(function(){
		
		var usercode1=$('.usercode1').attr('title');
		var username1=$('.username1').attr('title');
		var comcode1=$('.comcode1').attr('title');
		var myhref="/getUser?op=updateUser&usercode="+usercode1+"&username="+username1+"&comcode="+comcode1;
		alert(myhref)
		location.href=myhref;
	});
	$('#removeMenu').click(function(){
		$('.modal-body').html("是否确认移出该用户的菜单权限？"); 
	});
	$('#deleteUser').click(function(){
		var usercode=$('#deleteUser').attr('title');
		if(usercode!=null){
			var isExist=$('.userSize').attr('title');
			if(isExist=='[]'){
				$('.modal-body').html("该用户不存在！");
			}
			else{
			$('.modal-body').html("是否确认删除？"+usercode);
			}
		}
		else{
			$('.modal-body').html("您需要按用户名筛选后才能做删除操作！");
		}
	});
	$('#modal-1').click(function(){
		var usercode=$('#deleteUser').attr('title');
		var gg=$('.getMenugrp').attr('title');
		alert(gg);
		if(usercode!=null){
			var isExist=$('.userSize').attr('title');
			if(isExist!='[]'){
				location.href=$('#deleteUser').attr('href');
			}
			
		}
	
	});
	$('#addUser').click(function(){
		var usercode= $("#usercode").val();
		var username=$("#username").val();
		var comcode=$("#comcode").val();
		var op='addUser';
		confirm("是否要添加用户"+usercode+'?')

		var url="/getUser?op="+op+"&usercode="+usercode+"&username="+username+"&comcode="+comcode;
alert(url);  
		if(usercode!=null&&usercode!=''&&username!=null&&comcode!=null){
			alert('111')
			location.href=url;
			
			
		}else{
			alert("请输入参数！")
		}
		
	
	});
	
	
 })
</script>
</html>